<template>
  <view class="bg-white flex h-84 items-center" border="base b-2 b-solid">
    <view class="bg-#3155B7 h-32 w-8" />
    <text class="ml-4 mr-2 font-medium text-#333">
      {{ props.title }}
    </text>
    <text class="text-xs text-#999">
      {{ props.description }}
    </text>
    <text class="flex-1" />
    <view v-if="props.url" class="pl-2.5 pr-4 text-xs text-#4470E7 flex h-full items-center" @click="navigateTo()">
      更多 <i class="i-ph-caret-right-bold block" />
    </view>
  </view>
</template>

<script setup lang="ts">

const props = defineProps<{
  title: string
  description?: string
  url?: string
}>()

async function navigateTo(url = props.url) {
  if (!url) return

  await uni.navigateTo({
    url,
  })
}

</script>

<style scoped>

</style>
